import React, { Component } from 'react';
import './HCmodifyPicture.css'
import { Flex, ImagePicker, WingBlank } from 'antd-mobile';
import du from '../../uitls/session'
class HCmodifyPicture extends Component {
    constructor() {
        super()
        this.state = ({
            files: [],
            userId: ''
        })
    }
    fanhui = () => {
        this.props.history.push({ pathname: '/Home/HCinformation/' + this.state.userId })
    }
    onChange = (files, type, index) => {
        console.log(files);
        this.setState({
            files,
        });
    }
    componentDidMount() {
        let a = du.getStorage('gerenuser')
        this.setState({
            userId: a.user_id
        })
    }
    render() {
        const { files } = this.state;
        return (
            <div className='HCmodifyPicture_box'>
                <Flex style={{ backgroundColor: '#FFD656' }}>
                    <Flex.Item>
                        <div className='HCmodifyPicture_title_icon'>
                            <i className="iconfont icon-jiantouarrowhead7" onClick={this.fanhui}></i>
                        </div>
                    </Flex.Item>
                    <Flex.Item>
                        <div className="HCmodifyPicture_sub-title">修改头像</div>
                    </Flex.Item>
                    <Flex.Item>
                        <div className='HCmodifyPicture_add'>保存</div>
                    </Flex.Item>
                </Flex>
                <div>
                    <WingBlank>
                        <ImagePicker
                            files={files}
                            onChange={this.onChange}
                            selectable={files.length < 1}
                            length='1'
                        />
                    </WingBlank>
                </div>
            </div>
        );
    }
}

export default HCmodifyPicture;